<html>
	<head>
		<meta charset="UTF-8">
		<title>我的网站</title>
		<style>
			*{ margin: 0; padding: 0;}
			a{color: #000000; text-decoration: none;}
			a:hover{color: #FF0000;}
			.mytitle{text-align: center;}
			#dowebok{width: 90%; margin: 0 auto; font-size: 14px;}
			#dowebok li { float: left; width: 30%; margin-left: 1%; padding-top: 1%;} 
			#dowebok li img { width: 100%;}
			#dowebok li .dt { width: 100%; text-align: center;}
			#dowebok li {list-style-type: none;}
		</style>
	</head>
	<body>
		<h1 class="mytitle">179000629徐阳光</h1>
		<ul id="dowebok">
			<li> 
				<div>
					<a href="task01/task01.html">
						<img src="img/task01/web1.jpg" alt="图片1" />
					</a>
				</div>
				<div class="dt">
					<a href="task01/task01.html">作品1：普通网页布局展示</a>
				</div>
				
			</li>
			<li>
				<div>
					<a href="task02/task02.html">
						<img src="img/task02/1.jpg" alt="图片1" />
					</a>
				</div>
				<div class="dt">
					<a href="task02/task02.html">作品2：普通网页布局展示</a>
				</div>
				
			</li>
			
			<li>
				<div>
					<a href="task04/task04.html">
						<img src="img/task04/2.jpg" alt="图片4" />
					</a>
				</div>
				<div class="dt">
					<a href="task04/task04.html">作品3：登录页面</a>
				</div>
				
			</li>
			<li>
				<div>
					<a href="task06/task06.html">
						<img src="img/tibet-1.jpg" alt="图片5" />
					</a>
				</div>
				<div class="dt">
					<a href="task06/task06.html">作品4:js打印图形</a>
				</div>
				
			</li>
			<li>
				<div>
					<a href="task10/task10.html">
						<img src="img/task10/img/task10.png" alt="图片6" />
					</a>
				</div>
				<div class="dt">
					<a href="task10/task10.html">作品5：Dom编程</a>
				</div>
				
			</li>
			<li>
				<div>
					<a href="事件/demo.html">
						<img src="img/事件/img/tank.png" alt="图片7" />
					</a>
				</div>
				<div class="dt">
					<a href="事件/demo.html">作品6：tank</a>
				</div>
				
			</li>
			
			<li>
				<div>
					<a href="BOM/BOM浏览器对象.html">
						<img src="img/BOM/日历.png" alt="图片9" />
					</a>
				</div>
				<div class="dt">
					<a href="BOM/BOM浏览器对象.html">作品7：日历时钟</a>
				</div>
				
			</li>
			<li>
				<div>
					<a href="jquery-dom/dom.html">
						<img src="img/jqerydom/qd.png"  />
					</a>
				</div>
				<div class="dt">
					<a href="jquery-dom/dom.html">作品8：操作属性</a>
				</div>
				
			</li>
			<li>
				<div>
					<a href="jquery事件/cart_task.html">
						<img src="img/jquery事件/gwc.png"  />
					</a>
				</div>
				<div class="dt">
					<a href="jquery事件/cart_task.html">作品9：购物车</a>
				</div>
				
			</li>
			<li>
				<div>
					<a href="jquery动画/jquery动画.html">
						<img src="./img/jquery动画/dh.png"/>
					</a>
				</div>
				<div class="dt">
					<a href="jquery动画/jquery动画.html">作品10：动画</a>
				</div>
				
			</li>
			<li>
				<div>
					<a href="jquery动画/tab_task.html">
						<img src="./img/jquery动画/c.png"/>
					</a>
				</div>
				<div class="dt">
					<a href="jquery动画/tab_task.html">作品10：购物车切换</a>
				</div>
				
			</li>
			<li>
				<div>
					<a href="ajax/Ajax.html">
						<img src="img/ajax/a.png"/>
					</a>
				</div>
				<div class="dt">
					<a href="ajax/Ajax.html">作品11：ajax异步编程</a>
				</div>
				
			</li>
		</ul>
	</body>
</html>
